
<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>H+ 后台主题UI框架 - 空白页</title>
    <meta name="keywords" content="">
    <meta name="description" content="">

    <link rel="shortcut icon" href="__STATIC__/layout/favicon.ico">
     <link href="__STATIC__/layout/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="__STATIC__/layout/css/font-awesome.css?v=4.4.0" rel="stylesheet">
     <!-- jqgrid-->
    <link href="__STATIC__/layout/css/animate.css" rel="stylesheet">
    <link href="__STATIC__/layout/css/style.css?v=4.1.0" rel="stylesheet">
    <link href="__STATIC__/layout/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">
    <link href="__STATIC__/layout/css/gyq.css" rel="stylesheet">
    <link rel="stylesheet" href="__STATIC__/layout/css/demo.css" type="text/css">
    <style>
    </style>
</head>

<body style="color:#333;padding:3px;">
    <!-- 标题 -->
    <div class="page-heade">
        <h2 class="title_color text-center">财年({$cainian.title}){$sheng}营销费用报表-费用科目占比分析(单位：元)</h2>
    </div>
    <!-- 标题 -->
    <table class="table table-bordered" style="margin:0">
		<tr>
		 <td>温馨提示：没有显示占比的月份则表示当月所有科目的费用合计为0。</td>
		</tr>
    </table>
    <div>
    <form action=""  class="form-inline">
  {volist name="kaohe2" id="vo"}
		{if $vo.zonge>0}
		
			<div id="mainImgDiv{$vo.key}" style="margin-top: 20px; height: 460px"></div>
		{/if}
    {/volist}
</form>
    </div>
    <!-- 全局js -->
    <script src="__STATIC__/layout/js/jquery.min.js?v=2.1.4"></script>
    <script src="__STATIC__/layout/js/bootstrap.min.js?v=3.3.6"></script>
    <!-- <script src="js/plugins/metisMenu/jquery.metisMenu.js"></script> -->
    <script src="__STATIC__/layout/js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
     <!-- <script src="js/plugins/layer/laydate/laydate.js"></script> -->
      <script src="__STATIC__/layout/js/plugins/echarts/echarts-all.js"></script>

      <script src="__STATIC__/layout/js/common.js"></script>
   <script>
        $(function(){

        	{volist name="kaohe2" id="vo"}
        	{if $vo.zonge>0}
        		var myChart = echarts.init(document.getElementById('mainImgDiv{$vo.key}')); 
			myChart.showLoading({
			    text: '正在努力的读取数据中...',    //loading话术
			});
		    var num=10;

		    var option = {
		    		title : {
		    	        text: '{$vo.title}',
		    	        x:'center'
		    	    },
		    	    tooltip : {
		    	        trigger: 'item',
		    	        formatter: "{a} <br/>{b} : {c} ({d}%)"
		    	    },
		    	    legend: {
		    	        orient : 'vertical',
		    	        x : 'left',
		    	        data:[{volist name="$vo.kemu" id="v"}{"value":{$v.jine},"name":"{$v.title}"},{/volist}]
		    	    },
		    	    toolbox: {
		    	        show : true,
		    	        feature : {
		    	            mark : {show: true},
		    	            dataView : {show: true, readOnly: false},
		    	            magicType : {
		    	                show: true, 
		    	                type: ['pie', 'funnel'],
		    	                option: {
		    	                    funnel: {
		    	                        x: '25%',
		    	                        width: '50%',
		    	                        funnelAlign: 'left',
		    	                        max: 1548
		    	                    }
		    	                }
		    	            },
		    	            restore : {show: true},
		    	            saveAsImage : {show: true}
		    	        }
		    	    },
		    	    series : [ 
			    	        {
			    	            name:'财年(2015)10月',
			    	            type:'pie',
			    	            data:[{volist name="$vo.kemu" id="v"}{"value":{$v.jine},"name":"{$v.title}"},{/volist}] 
			    	        }
				    	    
							,
							
		    	    ]
		    	};
				         
		    // ajax callback
			myChart.hideLoading();
		    // 为echarts对象加载数据 
		    myChart.setOption(option); 
		    {/if}
        	{/volist}
            /*饼状图*/
      
    $(window).resize(myChart.resize);
  })

    </script>
</body>

</html>
